<template>

	<div style="height: 500px;width: 40%;top: 100px;">

		<table border="1px" style="width: 100%;height: 50%;">

			<tr>
				<td>手机号：</td>
				<td><input type="text" v-model="user.username" /></td>
			</tr>
			<tr>
				<td>密码：</td>
				<td><input type="text" v-model="user.password" /></td>
			</tr>
			<tr>
				<td></td>
				<td><button @click="login()">登录</button></td>
			</tr>

		</table>

	</div>

</template>



<script>
	export default {

		data() {

			return {
				user: {}, //登录者

			}
		},
		methods: {

			login() {

				

				let that = this;  //存储 this

				console.log(this.user.username)

				console.log(this.user.password)
				
				let fd = new FormData();
				
				fd.append('username',this.user.username)
				fd.append('password',this.user.password)
				
				let token = '';  //定义空的 token
				console.log("获取token前=======")
				//登录获取 token
				this.$axios.post(`${that.$ip}/api/login`,fd,{headers:{'Content-Type':'multipart/x-www-form-urlencoded'}})
				.then((resp) =>{
					
					console.log("22222")
					
					//把 token 存入 window
					window.localStorage.setItem('token',resp.data.data.token);
					
					
					console.log(resp.data.data.token);
					
					//替换 token
					token = resp.data.data.token;
					
					console.log("获取登录用户信息前")
					//根据 token 获取 登录人的信息
					that.$axios.get(`${that.$ip}/api/user/info`,{headers:{'Authorization':`Bearer ${token}`}})
					.then((resp) =>{
						console.log(resp.data)
						
						that.$store.state.user.name = resp.data.data.uname;  //用户信息存入全局变量里
						that.$store.state.user.role = resp.data.data.role;
						that.$store.state.user.pic = resp.data.data.pic;
						
						
						
						
						console.log("=====图片显示=====")
						console.log(that.$store.state.user.pic)
						
						let role = that.$store.state.user.role;  //定义临时变量
						console.log("role == " + role)
						
						
						
						if(role == "adm"){  //如果登录的是管理员
							console.log("管理员登录")
							that.$router.push('/adm');  //把导航栏的 role 改成 中文的
							that.$store.state.user.rolename = '教务处';  //中文的 role
							return;
						}
						if(role == "stu"){
							console.log("学生登录")
							that.$router.push('/stu');
							that.$store.state.user.rolename = '学生';  //中文的 role
							return;
						}
						if(role == "tea"){
							console.log("教师登录")
							that.$router.push('/tea');
							that.$store.state.user.rolename = '教师';  //中文的 role
							return;
						}
						
						
					})
				})

			}

		},
		mounted() {


		}

	}
</script>

<style>
</style>
